<template>
  <div>
    
  <!-- <ul> -->
    <!-- <li v-for='(item,index) in arr'>
      {{item}}
      {{index}}
      </li> -->

  <!-- </ul> -->

  <!-- <div v-if="arr.length>0">
    <h2 v-for="item in arr">{{item}}</h2>
  </div>
  <div v-else>空</div>
  -->

  <!-- <div v-for="(item,index) in arr" :key="index"> for循环
    {{item}}
  </div> -->

  <!-- <button @click="btn">安吉111</button>   -->
 <!-- vue 的事件用@ -->



<!-- /////////////////////案例 -->

   <ul>
    
     <li v-for="(item,index) in arr" :key="index">
        <input type="checkbox" name="">
        {{item}}
       
       </li>
       <button @click="del">删除</button>
   </ul>


  </div>
 




</template>
<script>
    export default {
      data(){
        return {
          // title:"xxxxxx123",
          // src:"1.jpg",
          arr:["a","b","c"]
          
        }
      },
      methods:{
        del (){
         this.arr.splice(0,1)
        }
      }
    
    }




</script>




<style type="text/css">
  div{
    background:red;
  }


</style>